<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2018/10/25
  Time: 11:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <script src="bootstrap/js/jquery-2.1.0.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <title>登录页面</title>
    <style>
        h1{
            text-align: center;
            margin-top: 30px;
        }
        form{
            margin-top: 100px;
        }
        img{
            margin: 15px;
            float: none;
        }
        span{
            color: red;
        }
        body{
            background-color: cornsilk;
        }

        h4{
            color: red;
        }
    </style>
    <script>
        function validate() {
            var username = document.getElementById("username").value;
            if (username == null || username == ""){
                alert("用户名不能为空");
                return false;
            }
            var password = document.getElementById("password").value;
            if (password == null || password ==""){
                alert("密码不能为空");
                return false ;
            }

            var check = document.getElementById("check").value;
            if (check == null || check == "")
            {
                alert("验证码不能为空");
                return false;
            }
        }
    </script>
</head>
<body>
<h1 >欢迎来到后台管理系统</h1>
<c:set var="root" value="${pageContext.request.contextPath}"/>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-5 column">
            <%--<img src="${root}/images/login.png"/>--%>
        </div>
        <div class="col-md-7 column">
            <%--<div>--%>
                <%--<img src="images/主页.jpg">--%>
            <%--</div>--%>
            <form class="form-horizontal" role="form"  onsubmit=" return validate()" action="${root}/loginServlet" method="post">
                <h4>
                    <%
                        String msg = (String) request.getAttribute("msg");
                        if (msg != null)
                        {
                            out.print(msg);
                        }
                    %>
                </h4>
                <div class="form-group">
                    <label for="username" class="col-sm-2 control-label">用户名</label>
                    <div class="col-sm-5">
                        <input type="text" class="form-control" id="username" name="username" value="" placeholder=""/>
                    </div>
                </div>
                <div class="form-group">
                    <label for="password" class="col-sm-2 control-label">密码</label>
                    <div class="col-sm-5">
                        <input type="password" class="form-control" id="password" name="password" value="" placeholder=""/>
                    </div>
                </div>
                <div class="form-group">
                    <label for="check" class="col-sm-2 control-label">验证码</label>
                    <div class="col-sm-5">
                        <input type="text" class="form-control" id="check" name="check" value="" placeholder=""/>
                        <img src="${root}/checkServlet">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button  type="submit" class="btn btn-default">登录</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
</html>
